//显示学生成绩
<template>
	<div class="table">
		<p class="title">我的分数</p>
		<section class="content-el">
			<div id="searchdiv">
				<el-input placeholder="考试名称" v-model="input" >
					<el-button @click="search()" slot="append" icon="el-icon-search"></el-button>
				</el-input>
			</div>
			<el-table ref="filterTable" :data="score" v-loading="loading">
				<el-table-column prop="exam.examBegin" label="考试时间" column-key="answerDate" sortable>
				</el-table-column>
				<el-table-column prop="exam.examName" label="考试名称" filter-placement="bottom-end">
					<template slot-scope="scope">
						<el-tag>{{scope.row.exam.examName}}</el-tag>
					</template>
				</el-table-column>
				<el-table-column prop="exam.examTime" label="答题时间/min"></el-table-column>
				<el-table-column prop="totalScore" label="考试分数" sortable></el-table-column>
        <el-table-column prop="exam.exampaper.count" label="试卷总分"></el-table-column>
				<el-table-column label="是否及格" width="100">
					<template slot-scope="scope">
						<el-tag :type="scope.row.totalScore >= (scope.row.exam.exampaper.count) * 0.6 ? 'success' : 'danger'">{{scope.row.totalScore >= (scope.row.exam.exampaper.count) * 0.6 ? "及格" : "不及格"}}</el-tag>
					</template>
				</el-table-column>
				<el-table-column fixed="right" label="操作">
					<template slot-scope="scope">
						<!-- showPaper() 方法中应该要传递用户编号和课程编号 -->
						<el-button type="primary" size="small" @click="showPaper(scope.row)">查看试卷</el-button>
					</template>
				</el-table-column>
			</el-table>
			<el-row type="flex" justify="center" align="middle" class="pagination">
				<el-pagination @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="pagination.current"
				 :page-sizes="[4,6,8,10]" :page-size="pagination.size" layout="total, sizes, prev, pager, next, jumper" :total="pagination.total">
				</el-pagination>
			</el-row>
		</section>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				pagination: { //分页后的留言列表
					current: 1, //当前页
					total: null, //记录条数
					size: 10 //每页条数
				},
				loading: false, //加载标识符
				score: [], //学生成绩
				filter: null, //过滤参数
				input:""
			}
		},
		created() {
			this.getScore()
			this.loading = true //数据加载则遮罩表格
		},
		methods: {
			getScore() {
				let studentId = this.$cookies.get("cid")
				this.$axios('/api/getScore1', {
					params: {
						keywords: "",
						userId: studentId,
						page: this.pagination.current,
						limit: this.pagination.size
					}
				}).then(res => {
          console.log(res)
					this.loading = false //数据加载完成去掉遮罩
					this.score = res.data.records;
					this.pagination = {
            ...res.data
					}
					let mapVal = this.score.map((element, index) => { //通过map得到 filter:[{text,value}]形式的数组对象
						let newVal = {}
						newVal.text = element.answerDate
						newVal.value = element.answerDate
						return newVal
					})
					let hash = []
					const newArr = mapVal.reduce((item, next) => { //对新对象进行去重操作
						hash[next.text] ? '' : hash[next.text] = true && item.push(next);
						return item
					}, []);
					this.filter = newArr
				})
			},
			//改变当前记录条数
			handleSizeChange(val) {
				this.pagination.size = val
				this.getScore()
			},
			//改变当前页码，重新发送请求
			handleCurrentChange(val) {
				this.pagination.current = val
				this.getScore()
			},
			formatter(row, column) {
				return row.address;
			},
			filterTag(value, row) {
				return row.tag === value;
			},
			filterHandler(value, row, column) {
				const property = column["property"];
				return row[property] === value;
			},
			search(){
        let studentId = this.$cookies.get("cid")
				this.$axios('/api/getScore1', {
					params: {
						keywords: this.input,
						userId: studentId,
						page: this.pagination.current,
						limit: this.pagination.size
					}
				}).then(res => {
					console.log(res);
					this.loading = false //数据加载完成去掉遮罩
					this.score = res.data.records;
					this.pagination = { ...res.data
					}
					let mapVal = this.score.map((element, index) => { //通过map得到 filter:[{text,value}]形式的数组对象
						let newVal = {}
						newVal.text = element.answerDate
						newVal.value = element.answerDate
						return newVal
					})
					let hash = []
					const newArr = mapVal.reduce((item, next) => { //对新对象进行去重操作
						hash[next.text] ? '' : hash[next.text] = true && item.push(next);
						return item
					}, []);
					this.filter = newArr
				})
			},
			showPaper(row) {
				var totalScore=row.totalScore;
				var exam=row.exam;
				var examId=row.exam.examId;
				console.log("examId"+examId);
				var paperId=row.exam.exampaper.paperId;
				console.log("paperId"+paperId);
				// 跳转到考卷页面 -- 要带参数跳转
				this.$router.push({
					path: '/myPaper',
					query: {
						totalScore:totalScore,
						exam:exam,
						examId:examId,
						paperId:paperId
					}
				})
			}
		}
	};
</script>

<style lang="scss" scoped>
	.pagination {
		padding-top: 20px;
	}

	.table {
		width: 980px;
		margin: 0 auto;

		.title {
			margin: 20px;
		}

		.content-el {
			background-color: #fff;
			padding: 20px;
		}
	}

	#searchdiv {
		width: 250px;
		display: inline-block;
		margin-left: 70%;
		margin-bottom: 5px;
	}
</style>
